<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<!doctype html>
<html>

<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>订单列表</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css" type="text/css"/>
    <script src="${pageContext.request.contextPath}/js/jquery-1.11.3.min.js" type="text/javascript"></script>
    <script src="${pageContext.request.contextPath}/js/bootstrap.min.js" type="text/javascript"></script>
    <!-- 引入自定义css文件 style.css -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css" type="text/css"/>
    <style>
        body {
            margin-top: 20px;
            margin: 0 auto;
        }

        .carousel-inner .item img {
            width: 100%;
            height: 300px;
        }

        .container .row div {
            /* position:relative;
            float:left; */
        }

        font {
            color: #3164af;
            font-size: 18px;
            font-weight: normal;
            padding: 0 10px;
        }
    </style>
</head>

<body>
<jsp:include page="header.jsp"/>
<c:if test="${username==null}">
    <div style="margin-left: 600px">
        您还没有登录，请先登录：<a href="${pageContext.request.contextPath}/login">登录</a>
    </div>
</c:if>
<c:if test="${username!=null}">
    <c:if test="${order.list==null}">
        <div style="margin-left: 600px">
            您还没有订单，快去添加吧！<a href="${pageContext.request.contextPath}/index">首页</a>
        </div>
    </c:if>
    <c:if test="${order.list!=null}">
        <div class="container">
            <div class="row">
                <div style="margin:0 auto; margin-top:10px;width:950px;">
                    <strong style="font-size:16px;margin:5px 0;">订单详情</strong>
                    <table class="table table-bordered" >
                        <tbody>
                        <tr class="warning" align="center">
                            <td hidden>序号</td>
                            <td>图片</td>
                            <td>商品</td>
                            <td>数量</td>
                            <td>价格</td>
                            <td>地址</td>
                            <td>状态</td>
                            <td>操作</td>
                        </tr>
                        <c:forEach items="${order.list}" var="order">
                            <tr class="active" align="center">
                                <td width="5%" hidden>
                                    <span class="orderId">${order.orderId}</span>
                                </td>
                                <td width="60" width="40%">
                                    <img src="${pageContext.request.contextPath}/static/work/Tomcat/localhost/ROOT/${order.product.pimage}"
                                         width="70" height="60">
                                </td>
                                <td width="15%">
                                    <a target="_blank">${order.product.productName}</a>
                                </td>
                                <td width="10%">
                                        ${order.orderProductNum}
                                </td>
                                <td width="10%">
                                    ￥${order.orderPrice}
                                </td>
                                <td width="25%">
                                        ${order.orderAddress}
                                </td>
                                <td width="10%">
                                        ${order.oState.orderStateName}
                                </td>
                                <td align="center" width="25%">
                                    <c:if test="${order.orderState==0}">
                                        <button class="btn btn-default" onclick="backMoney(${order.orderId})">退款</button>
                                    </c:if>
                                    <c:if test="${order.orderState==1}">
                                        <button class="btn btn-success" onclick="confirmReceipt(${order.orderId})">确认收货</button>
                                        <button class="btn btn-primary"  onclick="refund(${order.orderId})">申请退款</button>
                                    </c:if>
                                    <c:if test="${order.orderState==3}">
                                        <button class="btn btn-info" onclick="cancelRefund(${order.orderId})">取消退款</button>
                                    </c:if>
                                    <c:if test="${order.orderState==4}">
                                        <button class="btn btn-warning" onclick="cancelOrder(${order.orderId})">取消订单</button>
                                        <button class="btn btn-danger"  onclick="pay(${order.orderId})">付款</button>
                                    </c:if>
                                </td>
                            </tr>
                        </c:forEach>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </c:if>
</c:if>
<div style="margin-top:50px;">
    <img src="${pageContext.request.contextPath}/image/footer.jpg" width="100%" height="78" alt="我们的优势" title="我们的优势"/>
</div>

<div style="text-align: center;margin-top: 5px;">
    <ul class="list-inline">
        <li><a>关于我们</a></li>
        <li><a>联系我们</a></li>
        <li><a>招贤纳士</a></li>
        <li><a>法律声明</a></li>
        <li><a>友情链接</a></li>
        <li><a target="_blank">支付方式</a></li>
        <li><a target="_blank">配送方式</a></li>
        <li><a>服务声明</a></li>
        <li><a>广告声明</a></li>
    </ul>
</div>
<div style="text-align: center;margin-top: 5px;margin-bottom:20px;">
    Copyright &copy; 2005-2016 材搬配建材商城 版权所有
</div>

</body>

<script>
    function backMoney(orderId) {
        $.ajax({
            url: "/cbp/order/backMoney/"+orderId,
            type: "put",
            dataType: "json",
            success: function (json) {
                alert(json.msg);
                window.location.href = "http://localhost:8088/cbp/order";
            }
        });
    }
    function confirmReceipt(orderId) {
        $.ajax({
            url: "/cbp/order/confirmReceipt/"+orderId,
            type: "put",
            dataType: "json",
            success: function (json) {
                alert(json.msg);
                window.location.href = "http://localhost:8088/cbp/order";
            }
        });
    }
    function refund(orderId) {
        $.ajax({
            url: "/cbp/order/refund/"+orderId,
            type: "put",
            dataType: "json",
            success: function (json) {
                alert(json.msg);
                window.location.href = "http://localhost:8088/cbp/order";
            }
        });
    }
    function cancelRefund(orderId) {
        $.ajax({
            url: "/cbp/order/cancelRefund/"+orderId,
            type: "put",
            dataType: "json",
            success: function (json) {
                alert(json.msg);
                window.location.href = "http://localhost:8088/cbp/order";
            }
        });
    }
    function cancelOrder(orderId) {
        $.ajax({
            url: "/cbp/order/cancelOrder/"+orderId,
            type: "put",
            dataType: "json",
            success: function (json) {
                alert(json.msg);
                window.location.href = "http://localhost:8088/cbp/order";
            }
        });
    }
    function pay(orderId) {
        $.ajax({
            url: "/cbp/order/pay/"+orderId,
            type: "put",
            dataType: "json",
            success: function (json) {
                alert(json.msg);
                window.location.href = "http://localhost:8088/cbp/order";
            }
        });
    }

</script>
</html>
